<template>
  <BasicModal v-bind="$attrs" @register="bomImptModal" destroyOnClose :maskClosable="false" :title="title" width="80%" :minHeight="500" @ok="handleSubmit" @visible-change="handleClose">
    <a-space>
      <a-upload v-model:file-list="fileList"
                :multiple="false"
                :maxCount="1"
                name="file"
                :showUploadList="false"
                :action="uploadUrl"
                :headers="headers"
                :before-upload="bomUploadBefore"
                @change="handleImport">
        <a-button type="primary">
          导入销售清单
        </a-button>
      </a-upload>
      <a-button type="link" @click="downloadTemp">
        模板下载
      </a-button>
    </a-space>
    <BasicTable @register="registerBomsTable" :max-height="600" :pagination="false"></BasicTable>
  </BasicModal>
</template>

<script lang="ts" setup>
    import {ref, computed, unref} from 'vue';
    import {downloadByUrl} from "@/utils/file/download";
    import {BasicModal, useModal, useModalInner} from '/@/components/Modal';
    import {BasicTable, useTable, TableAction} from '/@/components/Table';
    import { getFileAccessHttpUrl, getHeaders } from '/@/utils/common/compUtils';
    import {imptProductColumns} from '../WmContract.data';
    import { useGlobSetting } from '/@/hooks/setting';
    import { useMessage } from '/@/hooks/web/useMessage';
    import {saveOrUpdate,deleteByPatchNo,confirmBatchBom} from '../WmContract.api';

    const { createMessage } = useMessage();
    // Emits声明
    const emit = defineEmits(['register','success']);
    const contract = ref<Recordable>({});
    const productList = ref<Recordable[]>([])
    const fileList = ref()
    const headers = getHeaders()
    const globSetting = useGlobSetting();
    const baseUploadUrl = globSetting.uploadUrl;
    const uploadUrl = ref('')

    const [registerBomsTable,{reload}] = useTable({
      dataSource:productList,
      columns: imptProductColumns,
      bordered: true,
      useSearchForm: false,
    });

    //表单赋值
    const [bomImptModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
      setModalProps({confirmLoading: false,showCancelBtn:false,showOkBtn:true});
      contract.value=data.record
      uploadUrl.value = `${baseUploadUrl}/wmhb/wmContractProduct/importExcel/${data.record.id}`;
    });
    //设置标题
    const title = ref('合同产品导入')

    function handleImport(res){
      if (res.file.status == 'done'){
        const response = res.file.response
        if (!response.success){
          createMessage.error(response.message)
          return
        }
        if (response.result)
          contract.value.batchNo = response.result.batchNo
          productList.value = response.result.bomNodeList
      }
    }
    function bomUploadBefore(file){
      if (!contract.value.batchNo)
        return Promise.resolve()
      deleteByPatchNo({batchNo:contract.value.batchNo}).then(result=>{
         contract.value.batchNo = null
        return Promise.resolve()
      }).catch(err=>{
        return false
      })
    }

    function handleClose(visible){
      if (!visible){
        contract.value={}
        productList.value=[]
        fileList.value=[]
        emit('success')
      }
    }

    function downloadTemp(){
      const url = 'http://erpapi.wm-mis.com/jeecg-boot/sys/common/static/temp/导入合同产品模板__锅炉系统_1733271485491.xlsx'
      const fileName = '合同产品模板'
      downloadByUrl({url,fileName})
    }

    function handleSuccess(){
      closeModal()
      emit('success')
    }

    //表单提交事件
    function handleSubmit(v) {
      confirmBatchBom({batchNo:contract.value.batchNo},handleSuccess)
    }
</script>

<style lang="less" scoped>
	/** 时间和数字输入框样式 */
  :deep(.ant-input-number) {
    width: 100%;
  }

  :deep(.ant-calendar-picker) {
    width: 100%;
  }
</style>
